﻿Namespace("sketch.ui.iphone");

(function () {
    var iphone = sketch.ui.iphone,
        common = sketch.ui.common,
        fwk = sketch.framework;

    iphone.PortraitPhone = klass(fwk.Container, {
        _constructor:function(){
            var that = this;
            this.canSelect(false);

            this.properties.bind("parent", function(event){
                var parent = event.newValue;
                parent.onresize.bind(new EventHandler(that, that.onParentResize));
            });
            this._image = new Image();
            this._image.src = "img/iphonePortrait.png";
            this._imageWidth = 380;
            this._imageHeight = 747;

            this._pannelWidth = 320;
            this._pannelHeight = 480;
            
            this._pannel = new common.DockPannel(true);
            this._pannel.canSelect(false);
            this.ensurePannelSize();
            this.add(this._pannel);
        },
        hitTest:function(){
            return false;
        },
        ensurePannelSize:function(){
            var x = (this.width() - this._pannelWidth)/2;
            var y = (this.height() - this._pannelHeight)/2;
            var rect = {
                x:x,
                y:y,
                width:this._pannelWidth,
                height:this._pannelHeight
            };
            this._pannel.resize(rect);
        },
        drawSelf:function(context){
            
            var x = (this.width() - this._imageWidth)/2;
            var y = (this.height() - this._imageHeight)/2;
            context.drawImage(this._image, x, y);
            
            iphone.PortraitPhone.Super.drawSelf.call(this, context);
        },
        onParentResize:function(event){
            this.width(this.parent().width());
            this.height(this.parent().height());
            this.ensurePannelSize();
        }
    });
})();